import React from "react";
import styles from "./index.module.less";
import defaultHead from "@images/sex1.webp";
import { connect } from "react-redux";
import { selectItemNameShowChatHead } from "@redux/actions02";
import { useNavigate } from "react-router-dom";

const Item = (props) => {
    const { img, user, selectItemNameShowChatHead, path } = props;
    const navigate = useNavigate();

    return (
        <div
            className={styles.item}
            onClick={() => {
                selectItemNameShowChatHead(user);
                navigate(path);
            }}
        >
            <div className={styles.img}>
                <img src={img || defaultHead} alt="" />
            </div>
            <p className={styles.user}>{user || "虚位以待"}</p>
        </div>
    );
};

export default connect((state) => state, { selectItemNameShowChatHead })(Item);
